<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" layout:decorate="main"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="UTF-8">
    <title>客户贡献分析</title>

</head>
<body>
<div layout:fragment="content">
    <!-- 为 ECharts 准备一个定义了宽高的 DOM -->
    <div id="mains" style="width: 1100px;height:800px;"></div>
    <script th:src="@{../js/echarts.min.js}" src="../../static/js/echarts.min.js"></script>
    <script type="text/javascript" th:inline="javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('mains'));
        var customerName =[[${customerName}]]
        var customerPrice = [[${customerPrice}]]
        // 指定图表的配置项和数据
        var option = {
            title: {
                text: '          客户贡献分析'
            },
            tooltip: {},
            legend: {
                data: ['销售额']
            },
            xAxis: {
                data:customerName
            },
            yAxis: {

            },
            series: [
                {
                    name: '销售额',
                    type: 'line',
                    smooth: true,
                    data:customerPrice
                }
            ]
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    </script>
</div>
</body>
</html>